<template>
  <el-button-group class="ed-toolbar">
    <template v-for="btn in btns">
      <ed-dialog-view-button
        v-if="btn.dialog"
        :key="btn.key"
        :row="row"
        :title="btn.label"
        v-bind="btn"
      />
      <ed-btn
        v-else
        v-bind="btn"
        :key="btn.key"
        :value="btn.switch && row[btn.switch]"
        @click="click"
      />
    </template>
    <slot />
  </el-button-group>
</template>

<script>
import EdBtn from './EdBtn'
import EdDialogViewButton from './EdDialogViewButton'
export default {
  props: {
    items: {
      type: Array,
      default: () => []
    },
    row: {
      type: [Object, Array],
      default: () => null
    }
  },
  computed: {
    btns () {
      const vm = this
      return this.items.map((btn) => {
        let r = {
          ...vm.$attrs,
          ...btn
        }
        // 切换信息
        if (btn.switch) r.value = vm.row[btn.switch]
        // disable
        if (btn.disabled) r.disabled = vm.row[btn.disabled]
        return r
      })
    }
  },
  components: {
    EdBtn,
    EdDialogViewButton
  },
  methods: {
    click (btn) {
      this.$emit('click', btn, this.row)
    }
  }
}
</script>

<style scoped>

</style>
